<template>
	<div class="today">
		<div class="tab clear">
			<div class="tab_btn fl" :class="{'active':todayType == 'mz'}" @click="tab('mz')">门诊</div>
			<div class="tab_btn fl" :class="{'active':todayType == 'zy'}" @click="tab('zy')">住院</div>
		</div>
		<el-row>
			<el-col :span="24">
				<div class="grid-content bg-purple">
					<span class="fl">实时审核动态监测</span>
					<span style="margin:0 50px;">当前查询时间：{{checkData.nowTime}}</span>
					<el-button type="primary" @click="search">查询</el-button>
				</div>
				<div class="grid-content bg-purple border_top">
					<el-row>
						<el-col :span="8">
							<span class="state_tip">
								预判有问题处方/医生提交处方
							</span>
							<span class="state_value">
								{{checkData.yuPanCount}}/{{checkData.docTiJiaoCount}}
							</span>
						</el-col>
						<el-col :span="8">
							<span class="state_tip">
								药师审核处方/医生提交处方
							</span>
							<span class="state_value">
								{{checkData.phrShenHeCount}}/{{checkData.docTiJiaoCount}}
							</span>
						</el-col>
						<el-col :span="8">
							<span class="state_tip">
								药师干预处方/药师审核处方
							</span>
							<span class="state_value">
								{{checkData.phrGanYuCount}}/{{checkData.phrShenHeCount}}
							</span>
						</el-col>
						<el-col :span="8">
							<span class="state_tip">
								当前在线药师
							</span>
							<span class="state_value">
								{{checkData.phrOnlineCount}}
							</span>
						</el-col>
						<el-col :span="8">
							<span class="state_tip">
								审核医生数（监测范围内）
							</span>
							<span class="state_value">
								{{checkData.docShenHeCount}}
							</span>
						</el-col>
						<el-col :span="8">
							<span class="state_tip">
								自动干预数
							</span>
							<span class="state_value">
								{{checkData.ziDongGanYuCount}}
							</span>
						</el-col>	
					</el-row>
				</div> 
			</el-col>
		</el-row>
		<div class="today_btn">
			<el-button type="danger" @click="upload">导出XLS</el-button>
		</div>
		<div class="to_table">
			<Bluetable :tHead="tHead" :tData="tableData"></Bluetable>
			<!-- <pagination :total="query.total" :page.sync="query.page" :limit.sync="query.limit" @pagination="getList" /> -->
		</div>
	</div>
</template>

<script>
	import Bluetable from "../../../components/Bluetable/index"
	import pagination from "../../../components/Pagination/index"
	import {ptc} from "@/api/systemport.js";
	export default {
		components:{Bluetable,pagination},
		data () {
			return {
				query:{
					total:100,
					page:1,
					limit:10
				},
				tHead:[
					{
						label:"序号",
						index:true
					},
					{
						prop:"real_name",
						label:"药师"
					},
					{
						prop:"onlineVal",
						label:"监测状态"
					},
					{
						prop:"startVal",
						label:"开始监测时间"
					},
					{
						prop:"endVal",
						label:"结束监测时间"
					},
					{
						prop:"cha_txt",
						label:"最近一次监测时长"
					},
					{
						prop:"shCount",
						label:"今日审核处方数"
					},
					{
						prop:"gyCount",
						label:"今日干预处方数"
					},
				],
				tableData: [],
				todayType:"mz",
				checkData:{}
			}
		},
		mounted () {
			this.getList();
			this.getMZdata();
		},
		methods:{
			search () {
				this.getList();
				if(this.todayType == "mz"){
					this.getMZdata();
				}else{
					this.getZYdata();
				}
			},
			async getMZdata () {
				let res = await this.$ptc.phrReportTodayMZ();
				this.checkData = res;
			},
			async getZYdata () {
				let res = await this.$ptc.phrReportTodayZY();
				this.checkData = res;
			},
			upload () {
				let href=process.env.VUE_APP_BASE_API+":"+ptc+"/core/phar/phrReport/download-excel?type="+this.todayType+"&HttpServletResponse=1";
				window.open(href, "_blank");
			},
			tab (val) {
				this.todayType = val;
				this.getList();
				if(val == "mz"){
					this.getMZdata();
				}else{
					this.getZYdata();
				}
			},
			async getList(){
				let _this = this;
				let res = await this.$ptc.phrReportToday({
					type:_this.todayType
				})
				var list = res.rows;
				for(var i in list){
					if(list[i].online == 0){
						list[i].onlineVal = "停止监测";
					}else if(list[i].online == 1){
						list[i].onlineVal = "开始监测";
					}
					list[i].startVal = _this.format(list[i].start);
					list[i].endVal = _this.format(list[i].end);
				}
				this.tableData = list;
			},
			format(timeStr){
				var time = new Date(timeStr*1000);
				var resultStr = "";
				var y = time.getFullYear();
				var m = time.getMonth()+1;
				var d = time.getDate();
				var h = time.getHours();
				var mm = time.getMinutes();
				var s = time.getSeconds();
				resultStr = y+"-"+this.add0(m,2)+"-"+this.add0(d,2)+" "+this.add0(h,2)+":"+this.add0(mm,2)+":"+this.add0(s,2);
				return resultStr;
			},
			add0 (num, n) {
				return (Array(n).join(0) + num).slice(-n);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.today{
		background:#fff;
		.tab{
			height:50px;
			line-height:50px;
			padding:0 20px;
			border-bottom:2px solid #e3ecf5;
			font-size:16px;
			color:#333;
			text-align:center;
			.tab_btn{
				width:100px;
				height:100%;
				cursor:pointer;
			}
			.tab_btn.active{
				color:#409eff;
				border-bottom:2px solid #409eff;
				height:50px;
			}
		}
		.grid-content{
			background:#fff;
			height:60px;
			border-radius: 4px;
			padding:0 20px;
			line-height:60px;
			font-size:16px;
			color:#333;
			&.border_top{
				border-top:1px solid #e7e7e7;height:auto;line-height:40px;
			}
			.state_tip{
				display:inline-block;
				font-size:14px;
				color:#28A4F4;
				width:55%;
			}
			.state_value{
				display:inline-block;
				font-size:14px;
				color:#06cc7a;
			}
		}
		.to_table{
			padding:0 20px;
		}
		.today_btn{
			text-align:left;
			margin:20px 0 20px 20px;
		}
	}
</style>
